import { useImmer } from "use-immer";
import { useState } from "react";
import { count } from "console";
function TodoList() {
  const [draft, setDraft] = useImmer({
    count: 1,
    age: 82,
    esx: "男",
  });
  const [state, usestate] = useState({
    count: 111,
    esx: 18,
  });

  function addTodo() {
    setDraft((draft) => {
      draft.count++;
    });
    usestate((state) => {
      return { ...state, count: 5 };
    });
  }
  return (
    <div>
      <ul> 数字是多少{draft.count}</ul>
      <div>年龄是多少{draft.age}</div>
      <div>性别是什么{draft.esx}</div>
      <div>原生{state.count}</div>
      <div>原生{state.esx}</div>
      <button onClick={addTodo}>数字增加</button>
      <button
        onClick={() =>
          setDraft((drafe) => {
            drafe.age = "用于18";
          })
        }
      >
        年龄改变
      </button>
      <button
        onClick={() =>
          setDraft((drafe) => {
            drafe.esx = "女";
          })
        }
      >
        性别改变
      </button>
    </div>
  );
}
export default TodoList;
